{% if let Some(msg) = message %}
<tr class="bg-yellow-100">
    <td colspan="7" class="p-2 text-center text-orange-700 font-bold">{{ msg }}</td>
</tr>
{% endif %}

{% for item in items %}
<tr class="border-b hover:bg-gray-50">
    <td class="px-4 py-2 text-center">{{ item.id }}</td>
    <td class="px-4 py-2 font-medium">{{ item.book_name }}</td>
    <td class="px-4 py-2 text-center">
        <span class="px-2 py-1 rounded text-sm
            {% if item.book_state == "已借" %} bg-red-100 text-red-800
            {% else if item.book_state == "修复" %} bg-yellow-100 text-yellow-800
            {% else %} bg-green-100 text-green-800 {% endif %}">
            {{ item.book_state }}
        </span>
    </td>
    <td class="px-4 py-2 text-sm text-gray-600">
        {% if let Some(dt) = item.borrow_datetime %}
            {{ dt.format("%Y-%m-%d %H:%M").to_string() }}
        {% else %}
            -
        {% endif %}
    </td>
    <td class="px-4 py-2 text-sm">{{ item.librarian.clone().unwrap_or_default() }}</td>
    <td class="px-4 py-2 text-center">{{ item.book_preserve }}</td>
    <td class="px-4 py-2 flex gap-2 justify-center">
        {% if item.book_state == "馆藏" %}
            <button hx-post="/books/action" hx-vals='{"item_id": {{ item.id }}, "action": "borrow"}' hx-target="#items-table"
                class="bg-blue-500 text-white px-3 py-1 rounded text-sm hover:bg-blue-600">借阅</button>
            <button hx-post="/books/action" hx-vals='{"item_id": {{ item.id }}, "action": "repair"}' hx-target="#items-table"
                class="bg-orange-500 text-white px-3 py-1 rounded text-sm hover:bg-orange-600">送修</button>
        {% else if item.book_state == "已借" %}
            <button hx-post="/books/action" hx-vals='{"item_id": {{ item.id }}, "action": "return"}' hx-target="#items-table"
                class="bg-green-500 text-white px-3 py-1 rounded text-sm hover:bg-green-600">归还</button>
        {% else if item.book_state == "修复" %}
            <button hx-post="/books/action" hx-vals='{"item_id": {{ item.id }}, "action": "repair"}' hx-target="#items-table"
                class="bg-teal-500 text-white px-3 py-1 rounded text-sm hover:bg-teal-600">修复完成</button>
        {% endif %}
    </td>
</tr>
{% endfor %}
